<template>
  <PageListContainer>
    <BreadCrumb>
      <template #default>
        <el-breadcrumb separator="/">
          <el-breadcrumb-item>创意讲师数据</el-breadcrumb-item>
          <el-breadcrumb-item>讲师发放管理</el-breadcrumb-item>
        </el-breadcrumb>
      </template>
    </BreadCrumb>
    <div class="base-block">
      <k-search :model="state.params" @search="methods.onSearch" @reset="methods.onReset">
        <el-form-item label="讲师搜索">
          <el-input v-model="state.params.keyword" clearable placeholder="请输入讲师账号名、手机号" style="width: 200px" />
        </el-form-item>
        <el-form-item label="跟进人">
          <el-input v-model="state.params.follower" clearable placeholder="请输入跟进人名称" style="width: 200px" />
        </el-form-item>
        <el-form-item label="加入时间">
          <el-date-picker
            v-model="state.params._dateRange"
            type="daterange"
            format="YYYY-MM-DD"
            value-format="YYYYMMDD"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            clearable
            :shortcuts="dateShortcut"
            @change="methods.onSearch"
          />
        </el-form-item>
      </k-search>
    </div>
    <div class="base-block">
      <KToolbar>
        <el-button type="primary" @click="onClickSendExtendUrl">推广链接发放</el-button>
        <template #right>
          <el-button type="default" :icon="Download" @click="onClickExportData">导出数据</el-button>
        </template>
      </KToolbar>

      <KTable v-bind="tableState" v-on="tableEvent">
        <template #code_cnt="s">
          <el-link type="primary" @click="onClickCodeCnt(s.row)">{{ s.row.code_cnt }}</el-link>
        </template>
        <template #bind_cnt="s">
          <el-link type="primary" :disabled="!s.row.is_can_click" @click="onClickBindCnt(s.row)">{{ s.row.bind_cnt }}</el-link>
        </template>
        <template #cos_fee="s">
          <el-link type="primary" :disabled="!s.row.is_can_click" @click="onClickCodeFee(s.row)">{{ s.row.cos_fee }}</el-link>
        </template>
        <template #extend_cnt="s">
          <el-link type="primary" @click="onClickExtendCnt(s.row)">{{ s.row.extend_cnt }}</el-link>
        </template>
        <template #extend_url_cnt="s">
          <el-link type="primary" @click="onClickExtendUrlCnt(s.row)">{{ s.row.extend_url_cnt }}</el-link>
        </template>
        <template #actions="s">
          <el-link type="danger" @click="onClickClear(s.row)">清空</el-link>
        </template>
      </KTable>
    </div>
    <!-- 推广链接发放-->
    <ExchangeExtendUrlModal ref="exchangeExtendUrlModal" @success="methods.onSearch" />
    <ExportModal ref="exportModalRef" />
  </PageListContainer>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { Download } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
import { useTableList } from './hooks/use-table';
import { lecClear } from '@/api/crm-agency/ad/lecturer';
import { baseConfirm } from '@crud/index';
import BreadCrumb from '@/components/base-bread-crumb/index.vue';
import ExchangeExtendUrlModal from './components/exchange-extend-url-modal.vue';
import ExportModal from './components/export-modal.vue';
import { AuthCode, hasPermission } from '@/modules/auth';
import { toolGetDateRangeShorcuts as dateShortcut } from '@/utils';

defineOptions({ name: 'AgencyAdLecturerLecturerList' });
const { state, tableState, tableEvent, ...methods } = useTableList({});
const router = useRouter();
// 推广链接发放
const exchangeExtendUrlModal = ref();
const onClickSendExtendUrl = () => {
  if (hasPermission(AuthCode.AGENCY_LECTURER_GIFT_PROMOTION_LINK)) {
    exchangeExtendUrlModal.value.show(0);
  }
};
// 导出
const exportModalRef = ref();
const onClickExportData = () => {
  if (hasPermission(AuthCode.AGENCY_LECTURER_LIST)) {
    exportModalRef.value.show(0, state.params);
  }
};
// 跳转
const onClickCodeCnt = (row: any) => {
  router.push({
    name: 'AgencyAdLecturerExchangeList',
    params: {
      agent_id: row.agent_id
    }
  });
};
const onClickBindCnt = (row: any) => {
  router.push({
    name: 'AgencyAdLecturerBindingList',
    params: {
      agent_id: row.agent_id
    }
  });
};
const onClickCodeFee = (row: any) => {
  router.push({
    name: 'AgencyAdLecturerCommissionList',
    params: {
      agent_id: row.agent_id
    }
  });
};
const onClickExtendCnt = (row: any) => {
  if (hasPermission(AuthCode.AGENCY_LECTURER_PROMOTION_LIST)) {
    router.push({
      name: 'AgencyAdLecturerPromotionList',
      params: {
        agent_id: row.agent_id
      }
    });
  }
};
const onClickExtendUrlCnt = (row: any) => {
  if (hasPermission(AuthCode.AGENCY_LECTURER_PROMOTION_LINK_LIST)) {
    router.push({
      name: 'AgencyAdLecturerPromoteLinkList',
      params: {
        agent_id: row.agent_id
      }
    });
  }
};
// 清空
const onClickClear = async (row: any) => {
  if (!hasPermission(AuthCode.AGENCY_LECTURER_UPDATE)) {
    ElMessage.warning('您没有该功能权限，请联系管理员');
    return;
  }
  await baseConfirm({ title: '删除', message: '你确定删除？' });
  await lecClear({ agent_id: row.agent_id });
  ElMessage.success('清空成功');
  methods.getList();
};
</script>
